<template>
  <el-dialog :append-to-body="true" :close-on-click-modal="false" :before-close="cancel" :visible.sync="dialog" :title="isAdd ? '新增' : '编辑'" open="initMethods" width="500px">
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
      <el-form-item v-if="isAdd" label="用户ID">
        <el-input v-model="form.id" style="width: 290px;"/>
        <el-button size="mini" type="primary" @click.prevent="verify(form.id)">验证</el-button>
      </el-form-item>
      <el-form-item v-if="verifyData.avatarUrl" label="用户头像">
        <el-avatar :src="verifyData.avatarUrl"></el-avatar>
      </el-form-item>
      <el-form-item v-if="verifyData.nickName" label="用户昵称" >
        <el-input v-model="verifyData.nickName" style="width: 370px;" readonly/>
      </el-form-item>
      <el-form-item label="代理名称" >
        <el-input v-model="form.name" style="width: 370px;"/>
      </el-form-item>
      <el-form-item label="级别" >
        <el-radio-group v-model="level" size="medium">
          <el-radio :label="2" border>一级代理</el-radio>
          <el-radio :label="3" border>二级代理</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="parseInt(level)===3" label="父级代理">
        <el-select v-model="form.parent" placeholder="请选择父级代理" style="width: 370px;">
          <el-option v-for="item in list" :key="item.openid" :label="item.name" :value="item.id"/>
        </el-select>
      </el-form-item>
      <el-form-item label="联系电话" >
        <el-input v-model="form.telphone" style="width: 370px;"/>
      </el-form-item>
      <el-form-item label="提成" >
        <el-input v-model="form.commission" style="width: 370px;"/>
      </el-form-item>
      <el-form-item label="地址" >
        <el-input v-model="form.area" style="width: 370px;"/>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="text" @click="cancel">取消</el-button>
      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { putRequest, postRequest, getRequest } from '@/api/identity'
export default {
  props: {
    isAdd: {
      type: Boolean,
      required: true
    }
  },
  data() {
    return {
      // tableData: this.tableData,
      loading: false, dialog: false,
      list: {},
      form: {
        id: '',
        name: '',
        level: 2,
        parent: '',
        telphone: '',
        commission: '',
        area: '',
        openid: '',
        accountId: ''
      },
      level: 1,
      verifyQuery: {
        page: 1,
        size: 10,
        value: '',
        type: 'id'
      },
      verifyData: [],
      rules: {
      }
    }
  },
  methods: {
    initMethods() {
      getRequest('/pc/agent', '').then(resp => {
        console.log(resp)
        this.list = resp.list
      })
      if (this.isAdd === false) {
        if (parseInt(this.level) === 3) {
          this.list.map(item => {
            if (item.level === 1) {
              item.children.map(item2 => {
                if (item2.openid === this.form.parent) {
                  this.form.parent = item2.name
                }
              })
            } else if (item.level === 2) {
              if (item.openid === this.form.parent) {
                this.form.parent = item.name
              }
            }
          })
        } else {
          this.form.parent = ''
        }
      }
    },
    verify(val) {
      this.verifyQuery.value = val
      postRequest('/pc/identity', this.verifyQuery).then(resp => {
        console.log(resp)
        if (resp.entity) {
          this.verifyData = resp.entity.content[0]
          this.form.openid = this.verifyData.openid
          this.form.accountId = this.verifyData.accountId
        }
      })
    },
    cancel() {
      this.resetForm()
      this.$parent.initMethod()
    },
    doSubmit() {
      this.loading = true
      if (this.isAdd) {
        this.doAdd()
      } else this.doEdit()
    },
    doAdd() {
      putRequest('/pc/agent', this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '添加成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.initMethod()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    doEdit() {
      putRequest('/pc/agent', this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '修改成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.initMethod()
      }).catch(err => {
        this.loading = false
        console.log(err.response.data.message)
      })
    },
    resetForm() {
      this.dialog = false
      this.$refs['form'].resetFields()
      this.form = {
        id: '',
        name: '',
        level: 2,
        parent: '',
        telphone: '',
        commission: '',
        area: '',
        openid: '',
        accountId: ''
      }
      this.level = 1
    }
  }
}
</script>

<style scoped>

</style>
